<template>
  <div id="app">
    <h2>Vue App</h2>
    <p ref="p">p标签</p>
    <button ref="btn" @click="showDOM">ref提示dom信息</button>
    <School ref="school">
      <p>slot contents</p>
    </School>
  </div>
</template>

<script>
import School from "@/components/School.vue";

export default {
  name: 'App',
  components: {
    School
  },
  methods: {
    showDOM() {
      console.log(this) // $children 子组件
      console.log(this.$refs.p) // dom
      console.log(this.$refs.btn) // dom
      console.log(this.$refs.school) // vc
    }
  }
}
</script>

<style>
</style>
